<template>
    <div class="Login">
        <div class="Login_box">
            <div class="fl Login_fl">
                <h1 class="Login_title">欢迎来到<br/>易采批</h1>
                <h2 class="Login_subtitle">你身边的采购专家</h2>
            </div>
            <div class="fr Login_fr">
                <div class="Login_header">
                    <nuxt-link class="Login_header_text Login_header_cur" to="/login/">登录</nuxt-link>
                    <span class="Login_header_divide">/</span>
                    <nuxt-link class="Login_header_text" to="/register/">注册</nuxt-link>
                </div>
                <div class="Login_form">
                    <div class="Login_form_group">
                        <div class="Login_form_div">
                            <label class="Login_form_label">请输入手机号</label>
                        </div>
                        <input
                        :class="{'Login_form_input_danger':errors.has('mobile')}"
                        v-validate="{required: true, max: 11, min: 11, regex: isMobile}"
                        class="Login_form_input"
                        v-model="mobile" name="mobile" maxlength="11" type="tel"/>
                        <p class="Login_form_tip" v-show="errors.has('mobile')">{{ errors.first('mobile') }}</p>
                    </div>
                    <div class="Login_form_group">
                        <div class="Login_form_div">
                            <label class="Login_form_label">请输入密码</label>
                            <nuxt-link class="Login_form_link fr" to="/findpassword/">忘记密码</nuxt-link>
                        </div>
                        <input
                        :class="{'Login_form_input_danger':errors.has('pwd')}"
                        class="Login_form_input"
                        v-validate="'required|max:16|min:6'"
                        maxlength="16"
                        v-model="pwd"
                        name="pwd"
                        type="password"/>
                        <p class="Login_form_tip" v-show="errors.has('pwd')">{{ errors.first('pwd') }}</p>
                    </div>
                    <div class="Login_form_footer">
                        <button class="Login_form_btn" :disabled="errors.has('mobile')||errors.has('pwd')" @click="doSubmit">登录</button>
                        <nuxt-link class="Login_form_link fr" to="/login/code">动态码登录</nuxt-link>
                    </div>
                </div>
            </div>
        </div>
    </div>
</template>

<script>
    import { isMobile } from "~/utils/regx"
    import { loginOnPassword } from "~/api/"
    import { haslogin } from "~/middleware/logincheck"

    export default {
      middleware: haslogin,
      data() {
          return {
              isMobile,
              mobile: "",
              pwd: ""
          }
      },
      methods: {
        doSubmit() {
          this.$validator.validateAll().then( async (result) => {
            if (!result) return
            const res = await loginOnPassword(this, this.mobile, this.pwd)
            // 登录失败
            if (res.code != '0') return this.$message.error(res.message)
            // 登录成功
            this.$store.dispatch('setLoginStatus', this.mobile)
            this.$message.success('登录成功')
            if (res.data.auditStatus === 'PASS') return this.$router.replace('/permission')
            if (res.data.auditStatus === 'NO_SUBMIT') return this.$router.replace('/qualified')
            if (res.data.auditStatus === 'AUDITING') return this.$router.replace('/qualified/result')
            // if (res.data.auditStatus === 'NO_PASS')
            this.$confirm(res.data.auditComment, '审核未通过', {
              confirmButtonText: '重新上传',
              cancelButtonText: '去个人中心',
              type: 'warning'
            }).then(() => {
              this.$router.replace('/qualified')
            }).catch(() => {
              this.$router.replace('/permission')
            })
          })
        }
      },
      beforeMount () {
      }
    }
</script>

<style lang="scss" scoped>

</style>
